import React from 'react';
import {
    NavigateFunction,
    useLocation,
    useNavigate,
    useParams,
    Location,
} from 'react-router';

export interface RoutedProps<
    Params = { [key: string]: string },
    State = { [key: string]: any }
> {
    location: Location & { state: State };
    navigate: NavigateFunction;
    params: Params;
}

export function withRouter<P extends RoutedProps>(
    Child: React.ComponentClass<P>
) {
    return (props: Omit<P, keyof RoutedProps>) => {
        const location = useLocation();
        const navigate = useNavigate();
        const params = useParams();

        return (
            <Child
                {...(props as P)}
                navigate={navigate}
                location={location}
                history={history}
                params={params}
            />
        );
    };
}
